<div class="charge-details">
    <!--确认弹窗-->
    <p-confirmDialog acceptLabel="确认" rejectLabel="取消"></p-confirmDialog>
    <!--消息提示-->
    <p-messages  [closable]="true" [style]="{'position':'fixed','left': '10vw','top': '0','margin-top': '0','width': '100vw','z-index':'9999'}"></p-messages>
    <!--顶部按钮-->
    <div class="charge-details-header">
      <div class="ui-g-1 charge-details-header-btn charge-details-header-btn-modify" (click)="modifyChargeDetail()" [hidden]="btnHiden[0].hidden">
        <img class="charge-details-header-img-modify" src="assets/images/ic_modify.png" alt="">
        <span>修  改</span>
      </div>
      <div class="ui-g-1 charge-details-header-btn charge-details-header-btn-delete" (click)="deleteChargeDetail()" [hidden]="btnHiden[1].hidden">
        <img class="charge-details-header-img-delete" src="assets/images/ic_delete.png" alt="">
        <span>删  除</span>
      </div>
      <div class="ui-g-1 charge-details-header-btn charge-details-header-btn-add" (click)="uploadFileClick()" [hidden]="btnHiden[2].hidden">
<!--        <img class="charge-margin-header-img-add" src="assets/images/ic_add.png" alt="">-->
        <span>导  入</span>
      </div>
<!--      搜索-->
      <div class="ui-inputgroup charge-details-header-search" *ngIf="!btnHiden[3].hidden">
        <p-dropdown [options]="searchOption" placeholder="请选择搜索范围.."  scrollHeight="100px"  [(ngModel)]="searchType" [style]="{'width': '8vw','margin-right':'2vw'}"></p-dropdown>
        <input type="text" pInputText placeholder="请输入需要搜索的值"  [(ngModel)]="searchData">
        <button id="disabled-btn" class="charge-details-header-btn-search" type="button"  (click)="detailsSearchClick()"  label="搜索">搜索</button>
      </div>
    </div>
  <!--<button class="charge-details-dialog-Btn charge-details-dialog-Btn-sure" style="position: absolute;top: 18.7vh;right: 5vw;z-index: 10000">搜索</button>-->
    <!--表格-->
    <div class="charge-details-table">
      <rbi-check-table-btn (detail)="detailsDialogClick($event)" [select]="paymentDetailSelect" [option]="optionTable" (selectData)="selectData($event)"></rbi-check-table-btn>
    </div>
  <!--缴费弹窗-->
  <p-dialog  class="parmentDialog"  header="账单修改" [(visible)]="paymentDialog" [width]="1000"  [transitionOptions]="'200ms'"  [closable]="false">
    <!--Content-->
    <p-scrollPanel [style]="{width:'100%',height: '75vh'}" styleClass="custombar">
      <div class="ui-g ui-fluid">
        <div class="ui-g-12">
          <h3>业主信息</h3>
        </div>
        <div class="ui-g-12">
          <div class="ui-g-6" *ngFor="let item of paymentAddTitle" style="line-height: 4vh">
            <div class="ui-g-4" style="text-align: right" >
              <label>{{item.name}}:</label>
            </div>
            <div class="ui-g-8" style="line-height: 2vh">
              <input  *ngIf="item.label !== 'dueTime'" pInputText type="text" [(ngModel)]="item.value" />
              <p-calendar *ngIf="item.label === 'dueTime'" [(ngModel)]="item.value" placeholder="请选择物业费到期时间..." [monthNavigator]="true" [yearNavigator]="true" dateFormat="yy-mm-dd"  yearRange="2017:2030" [locale]="esDate"></p-calendar>
            </div>
          </div>
        </div>
        <div class="ui-g-12" [hidden]="deductionDamagesData.length === 0">
          <h3>抵扣项目</h3>
        </div>
        <div class="ui-g-12" [hidden]="deductionDamagesData.length === 0">
          <p-table [columns]="deductioTitle" [value]="deductionDamagesData"  [scrollable]="true"  scrollHeight="48vh">
            <ng-template pTemplate="header" let-columns>
              <tr >
                <th *ngFor="let col of columns" >
                  {{col.header}}
                </th>
              </tr>
            </ng-template>
            <ng-template pTemplate="body" let-rowData let-columns="columns" let-rowIndex="rowIndex">
              <tr [pSelectableRow]="rowData" [ngStyle]="{'text-align':'center'}">
                <td  *ngFor="let col of columns" style="word-break: break-word">
                  {{rowData[col.field]}}
                </td>
              </tr>
            </ng-template>
          </p-table>
        </div>
        <div class="ui-g-12" [hidden]="parkSpaceData.length === 0">
          <h3>车位管理</h3>
        </div>
        <div class="ui-g-12" [hidden]=" parkSpaceData.length === 0">
          <p-table [columns]="parkspaceTitle" [value]="parkSpaceData"  [scrollable]="true"  scrollHeight="48vh">
            <ng-template pTemplate="header" let-columns>
              <tr >
                <th *ngFor="let col of columns" >
                  {{col.header}}
                </th>
              </tr>
            </ng-template>
            <ng-template pTemplate="body" let-rowData let-columns="columns" let-rowIndex="rowIndex">

              <tr [pSelectableRow]="rowData" [ngStyle]="{'text-align':'center'}">

                <td  *ngFor="let col of columns.slice(0 ,columns.length -1)" style="word-break: break-word">
                  <span *ngIf="col !== 'rentalRenewalStatus' && col !== 'parkingSpaceType'">{{rowData[col.field]}}</span>
                  <span *ngIf="col === 'rentalRenewalStatus'">{{rowData[col.field] === 0? '非续租': '续租'}}</span>
                  <span *ngIf="col === 'parkingSpaceType'">{{toolSrv.setValueToLabel(parkSpaceTypeOption, rowData[col.field])}}</span>
                </td>
                <td  *ngFor="let col of columns.slice(columns.length -1 ,columns.length)" style="word-break: break-word">
                  <button class="charge-details-dialog-Btn" style="background: #55AB7F;height: 3vh; width: 4vw;"  (click)="changePackSpaceInfo(rowIndex)">修改</button>
                  <button class="charge-details-dialog-Btn" style="background: #55AB7F;height: 3vh; width: 4vw;margin-top: 0.2vh" (click)="parkSpaceDetailClick(rowIndex)">详情</button>
                </td>
              </tr>
            </ng-template>
          </p-table>
        </div>
        <div class="ui-g-12">
          <h3>缴费明细</h3>
        </div>
        <div class="ui-g-12">
          <p-table   [columns]="paymentDialogTableTitle" [value]="paymentItemData"  [scrollable]="true" [resizableColumns]="true">
            <ng-template pTemplate="colgroup" let-columns>
              <colgroup>
                <col *ngFor="let col of columns" style="width:180px">
              </colgroup>
            </ng-template>
            <ng-template pTemplate="header" let-columns>
              <tr>
                <th *ngFor="let col of columns" >
                  {{col.header}}
                </th>
              </tr>
            </ng-template>
            <ng-template pTemplate="body" let-rowData let-columns="columns" let-rowIndex="rowIndex">
              <tr [pSelectableRow]="rowData" [ngStyle]="{'text-align':'center'}">
                <td *ngFor="let col of columns.slice(0, columns.length-1)" style="word-break: break-word">
                  <span *ngIf="col.field !== 'stateOfArrears'">{{rowData[col.field]}}</span>
                  <span *ngIf="col.field === 'stateOfArrears'">{{rowData[col.field]=== 0? '未欠费': '欠费'}}</span>
                </td>
                <td *ngFor="let col of columns.slice(columns.length-1, columns.length)" style="word-break: break-word">
                  <button class="charge-details-dialog-Btn" style="background: #55AB7F;height: 3vh; width: 4vw;" (click)="changeChargeItemDataClick(rowIndex)">修改</button>
                </td>
              </tr>
            </ng-template>
          </p-table>
        </div>
        <div class="ui-g-12">
          <div class="ui-g-9">
          </div>
          <div class="ui-g-3">
            <div >总计: <span [ngStyle]="{'font-size':'1.2rem'}">{{chargeDetails.amountTotalReceivable}}</span></div>
          </div>
        </div>
        <div class="ui-g-12">
          <h3>收费信息</h3>
        </div>
        <div class="ui-g-6" style="line-height:  3vh">
          <div class="ui-g-3"  style="text-align: right">
            <label >应收账单：</label>
          </div>
          <div class="ui-g-7" style="text-align: left">
              <input type="text" pInputText [(ngModel)]="chargeDetails.actualTotalMoneyCollection"/>
          </div>
        </div>
        <div class="ui-g-6" style="line-height:  3vh">
          <div class="ui-g-3" style="text-align: right">
            <label >实收账单：</label>
          </div>
          <div class="ui-g-7" style="text-align: left">
            <input type="text" pInputText [(ngModel)]="chargeDetails.amountTotalReceivable"/>
          </div>
        </div>
<!--        <div class="ui-g-6" style="line-height:  3vh">-->
<!--          <div class="ui-g-3" style="text-align: right">-->
<!--            <label >缴费方式：</label>-->
<!--          </div>-->
<!--          <div class="ui-g-7" style="line-height: 2vh;text-align: left">-->
<!--            <p-dropdown [options]="chargeStatusoption" [style]="{'width':'7vw'}" scrollHeight="100px" placeholder="请选择支付方式..." [(ngModel)]="chargeDetails.paymentMethod"></p-dropdown>-->
<!--          </div>-->
<!--        </div>-->
        <div class="ui-g-6" style="line-height:  3vh">
          <div class="ui-g-3" style="text-align: right">
            <label >预存金额：</label>
          </div>
          <div class="ui-g-7" style="text-align: left">
            <input type="text" pInputText [(ngModel)]="chargeDetails.correctedAmount"/>
          </div>
        </div>
        <div class="ui-g-6" style="line-height:  3vh">
          <div class="ui-g-3" style="text-align: right">
            <label >订单生成日期：</label>
          </div>
          <div class="ui-g-7" style="text-align: left">
            <p-calendar [(ngModel)]="chargeDetails.realGenerationTime" placeholder="请选择订单生成日期..." [monthNavigator]="true" [yearNavigator]="true" dateFormat="yy-mm-dd"  yearRange="2017:2030" [locale]="esDate"></p-calendar>
          </div>
        </div>
        <div class="ui-g-6" style="line-height:  3vh">
          <div class="ui-g-3" style="text-align: right">
            <label for="payerName">缴费人：</label>
          </div>
          <div class="ui-g-7" style="text-align: left">
            <input  id="payerName"  type="text" pInputText placeholder="请输入缴费人..." [(ngModel)]="chargeDetails.payerName">
          </div>
        </div>
        <div class="ui-g-6" style="line-height:  3vh">
          <div class="ui-g-3" style="text-align: right">
            <label for="payerPhone">缴费人电话：</label>
          </div>
          <div class="ui-g-7" style="text-align: left">
            <input  id="payerPhone" type="text" pInputText placeholder="请输入电话..." [(ngModel)]="chargeDetails.payerPhone" [maxlength]="11" (blur)="paymentPhoneChange(paymentOrderAdd.payerPhone)"  >
            <span style="color: red" [hidden]="phoneErrorToast">手机号格式错误</span>
          </div>
        </div>
        <div class="ui-g-6" style="line-height:  3vh">
          <div class="ui-g-3" style="text-align: right">
            <label for="remark">备注：</label>
          </div>
          <div class="ui-g-7" style="text-align: left">
            <textarea id="remark" pInputTextarea [(ngModel)]="chargeDetails.remark" [rows]="3" [cols]="33"></textarea>
          </div>
        </div>
      </div>
    </p-scrollPanel>
    <p-footer>
      <div class="ui-dialog-buttonpane ui-helper-clearfix" style="text-align: center">
        <button class="charge-details-dialog-Btn charge-details-dialog-Btn-sure" (click)="ModifypaymentSureClick()">确认</button>
        <button class="charge-details-dialog-Btn charge-details-dialog-Btn-false" (click)="ModifypaymentFaleseClick()">取消</button>
      </div>
    </p-footer>
  </p-dialog>
   <!--详情弹框-->
  <p-dialog header="费用详情" [(visible)]="detailsDialog" [width]="1100" >
      <!--Content-->
      <p-scrollPanel [style]="{width:'100%',height: '70vh'}" styleClass="custombar">
         <div class="ui-g ui-fluid">
        <div class="ui-g-12">
          <h3>业主信息</h3>
        </div>
        <div class="ui-g-12">
          <div class="ui-g-6" *ngFor="let item of paymentAddTitle">
            <div class="ui-g-6" style="text-align: right">
              <label >{{item.name}}：</label>
            </div>
            <div class="ui-g-6 span">
              <span >{{item.value}}<span *ngIf="item.name ==='建筑面积'">平米</span></span>
            </div>
          </div>
        </div>
        <div class="ui-g-12" *ngIf="deductioContent.length !== 0">
          <h3>抵扣信息</h3>
        </div>
        <div class="ui-g-12"  *ngIf="deductioContent.length !== 0">
          <p-scrollPanel [style]="liquidatedDamagesStyle" styleClass="custombar">
            <p-table [columns]="deductioTitle" [value]="deductioContent">
              <ng-template pTemplate="header" let-columns>
                <tr >
                  <th *ngFor="let col of columns" >
                    {{col.header}}
                  </th>
                </tr>
              </ng-template>
              <ng-template pTemplate="body" let-rowData let-columns="columns" let-rowIndex="rowIndex">
                <tr [pSelectableRow]="rowData"  [ngStyle]="{'text-align':'center'}">
                  <td  *ngFor="let col of columns" >
                    <span style="word-break: break-word">{{rowData[col.field]}}</span>
                  </td>
                </tr>
              </ng-template>
            </p-table>
          </p-scrollPanel>
        </div>
         <div class="ui-g-12" *ngIf="parkSpaceData.length !== 0">
           <h3>车位管理</h3>
         </div>
         <div class="ui-g-12" *ngIf="parkSpaceData.length !== 0">
           <p-table [columns]="parkspaceTitleDetail" [value]="parkSpaceData"  [scrollable]="true"  scrollHeight="48vh">
             <ng-template pTemplate="header" let-columns>
               <tr >
                 <th *ngFor="let col of columns" >
                   {{col.header}}
                 </th>
               </tr>
             </ng-template>
             <ng-template pTemplate="body" let-rowData let-columns="columns" let-rowIndex="rowIndex">
               <tr [pSelectableRow]="rowData" [ngStyle]="{'text-align':'center'}">
                 <td  *ngFor="let col of columns" style="word-break: break-word">
                   <span *ngIf="col !== 'rentalRenewalStatus' && col !== 'parkingSpaceType'">{{rowData[col.field]}}</span>
                   <span *ngIf="col === 'rentalRenewalStatus'">{{rowData[col.field] === 0? '非续租': '续租'}}</span>
                   <span *ngIf="col === 'parkingSpaceType'">{{toolSrv.setValueToLabel(parkSpaceTypeOption, rowData[col.field])}}</span>
                 </td>
               </tr>
             </ng-template>
           </p-table>
         </div>
        <div class="ui-g-12">
          <h3>缴费信息</h3>
        </div>
        <div class="ui-g-12">
            <p-table [columns]="paymentDialogTableTitle.slice(0,paymentDialogTableTitle.length-1)" [value]="detailsPaymentProject"  [scrollable]="true">
              <ng-template pTemplate="colgroup" let-columns>
                <colgroup>
                  <col *ngFor="let col of columns" style="width:150px">
                </colgroup>
              </ng-template>
              <ng-template pTemplate="header" let-columns>
                <tr >
                  <th *ngFor="let col of columns" >
                    {{col.header}}
                  </th>
                </tr>
              </ng-template>
              <ng-template pTemplate="body" let-rowData let-columns="columns" let-rowIndex="rowIndex">
                <tr [pSelectableRow]="rowData"  [ngStyle]="{'text-align':'center'}">
                  <td  *ngFor="let col of columns" >
                    <span style="word-break: break-word" *ngIf="col.field !== 'stateOfArrears'">{{rowData[col.field]}}</span>
                    <span style="word-break: break-word" *ngIf="col.field  === 'stateOfArrears'">{{rowData[col.field]===0? '未欠费': '已欠费'}}</span>
                  </td>
                </tr>
              </ng-template>
            </p-table>
<!--          </p-scrollPanel>-->
        </div>
        <div class="ui-g-12">
         <h3>收费信息</h3>
        </div>
        <div class="ui-g-12" [ngStyle]="{'line-height':'3vh'}">
          <div class="ui-g-6">
            <div class="ui-g-6" style="text-align: right">
              <label>缴费人：</label>
            </div>
            <div class="ui-g-6 span" style="line-height: 2vh">
              <span>{{chargeDetails.payerName}}</span>
            </div>
          </div>
          <div class="ui-g-6">
            <div class="ui-g-6"  style="text-align: right">
              <label >应收账单：</label>
            </div>
            <div class="ui-g-6 span" style="line-height: 2vh">
              <span >￥{{chargeDetails.amountTotalReceivable}}</span>
            </div>
          </div>
          <div class="ui-g-6">
            <div class="ui-g-6"  style="text-align: right">
              <label >实收账单：</label>
            </div>
            <div class="ui-g-6 span" style="line-height: 2vh">
              <span>￥{{chargeDetails.actualTotalMoneyCollection}}</span>
            </div>
          </div>
          <div class="ui-g-6">
            <div class="ui-g-6"  style="text-align: right">
              <label >缴费类型：</label>
            </div>
            <div class="ui-g-6 span" style="line-height: 2vh">
              <span>{{chargeDetails.paymentMethod}}</span>
            </div>
          </div>
          <div class="ui-g-6">
            <div class="ui-g-6"  style="text-align: right">
              <label >修正金额：</label>
            </div>
            <div class="ui-g-6 span" style="line-height: 2vh">
              <span >{{chargeDetails.correctedAmount}}</span>
            </div>
          </div>
          <div class="ui-g-6">
            <div class="ui-g-6"  style="text-align: right">
              <label >录单人：</label>
            </div>
            <div class="ui-g-6 span" style="line-height: 2vh">
              <span >{{chargeDetails.tollCollectorName}}</span>
            </div>
          </div>
          <div class="ui-g-12 ui-md-12" *ngFor="let item of paymentList">
            <div class="ui-g-6">
              <div class="ui-g-6"  style="text-align: right">
                <label >支付方式：</label>
              </div>
              <div class="ui-g-6 span" style="line-height: 2vh">
                <span >{{item.label}}</span>
              </div>
            </div>
            <div class="ui-g-6">
              <div class="ui-g-6"  style="text-align: right">
                <label >金额：</label>
              </div>
              <div class="ui-g-6 span" style="line-height: 2vh">
                <span >{{item.value}}</span>
              </div>
            </div>
          </div>
        </div>
      </div>
      </p-scrollPanel>
      <p-footer>
        <div class="ui-dialog-buttonpane ui-helper-clearfix" style="text-align: center">
          <button class="charge-details-dialog-Btn charge-details-dialog-Btn-sure" (click)="detailsSureClick()">打印单据</button>
          <button class="charge-details-dialog-Btn charge-details-dialog-Btn-false" (click)="detailsFaleseClick()">取 消</button>
        </div>
      </p-footer>
    </p-dialog>

<!--    修改费用详细-->
  <p-dialog header="修改费用" [(visible)]="chargeItemDialog" [width]="800"  [transitionOptions]="'200ms'"  [closable]="false" [positionTop]="150">
    <div class="ui-g ui-fluid">
      <div class="ui-g-6" style="line-height: 4vh" >
        <div class="ui-g-4" style="text-align: right">
          <label>折扣</label>
        </div>
        <div class="ui-g-8">
          <input type="text" placeholder="请输入折扣" pInputText [(ngModel)]="changePaymentItem.discont"/>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh" >
        <div class="ui-g-4" style="text-align: right">
          <label >月/张数</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <input type="text" pInputText  placeholder="请输入月/张数" [(ngModel)]="changePaymentItem.datedif"/>
        </div>
      </div>
      <div class="ui-g-6"  style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >应收金额</label>
        </div>
        <div class="ui-g-8" >
          <input type="text" pInputText  placeholder="请输入应收金额" [(ngModel)]="changePaymentItem.actualMoneyCollection"/>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >实收金额</label>
        </div>
        <div class="ui-g-8">
          <input type="text" pInputText placeholder="请输入实收金额" [(ngModel)]="changePaymentItem.amountReceivable"/>
        </div>
      </div>
      <div class="ui-g-6"  style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >使用量</label>
        </div>
        <div class="ui-g-8">
          <input type="text" pInputText placeholder="请输入使用量" [(ngModel)]="changePaymentItem.usageAmount"/>
        </div>
      </div>
      <div class="ui-g-6"  style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >当前读数</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <input type="text" pInputText placeholder="请输入当前读数" [(ngModel)]="changePaymentItem.currentReadings"/>
        </div>
      </div>
      <div class="ui-g-6"  style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >上次读数</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <input type="text" pInputText placeholder="请输入上次读数" [(ngModel)]="changePaymentItem.lastReading"/>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >开始计费时间</label>
        </div>
        <div class="ui-g-8">
          <p-calendar [(ngModel)]="changePaymentItem.startTime" placeholder="请选择计费开始日期..." [monthNavigator]="true" [yearNavigator]="true" dateFormat="yy-mm-dd"  yearRange="2017:2030" [locale]="esDate"></p-calendar>
        </div>
      </div>
      <div class="ui-g-6"  style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >结束计费时间</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <p-calendar [(ngModel)]="changePaymentItem.dueTime" placeholder="请选择计费结束日期..." [monthNavigator]="true" [yearNavigator]="true" dateFormat="yy-mm-dd"  yearRange="2017:2030" [locale]="esDate"></p-calendar>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >欠费状态</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <p-dropdown [options]="stateOfArrearsOption"  placeholder="请选择车辆原始类型" scrollHeight="100px" [(ngModel)]="changePaymentItem.stateOfArrears"></p-dropdown>
        </div>
      </div>
    </div>
    <p-footer>
      <div class="ui-dialog-buttonpane ui-helper-clearfix" style="text-align: center">
        <button class="charge-details-dialog-Btn charge-details-dialog-Btn-sure" (click)="changeChargeItemSureClick()">确认</button>
        <button class="charge-details-dialog-Btn charge-details-dialog-Btn-false" (click)="chargeItemDialog = false;">取消</button>
      </div>
    </p-footer>
  </p-dialog>

  <p-dialog header="租赁车位" [(visible)]="parkSpaceOptionDialog" [width]="800"  [transitionOptions]="'200ms'"  [closable]="false" [positionTop]="150">
    <div class="ui-g ui-fluid">

      <div class="ui-g-6" style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >合同编号</label>
        </div>
        <div class="ui-g-8">
          <input type="text" pInputText placeholder="请输入合同编号"  [(ngModel)]="rentalParkSpace.contractNumber"/>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >是否续租</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <p-dropdown [options]="rentalRenewalStatusOption" placeholder="请选择续租状态" scrollHeight="100px" [(ngModel)]="rentalParkSpace.rentalRenewalStatus"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >租赁月数</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <input type="text" pInputText placeholder="请输入租赁月数"  [(ngModel)]="rentalParkSpace.datedif"/>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh" >
        <div class="ui-g-4" style="text-align: right">
          <label>车位编号</label>
        </div>
        <div class="ui-g-8">
          <input type="text" placeholder="请选择车位编号" pInputText (click)="dataTreeClick()" [(ngModel)]="rentalCode"/>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh" >
        <div class="ui-g-4" style="text-align: right">
          <label >开始计费时间</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <p-calendar [(ngModel)]="rentalParkSpace.startTime" placeholder="请选择开始计费日期..." [monthNavigator]="true" [yearNavigator]="true" dateFormat="yy-mm-dd"  yearRange="2017:2030" [locale]="esDate"></p-calendar>
        </div>
      </div>
      <div class="ui-g-6"  style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >车主姓名</label>
        </div>
        <div class="ui-g-8" >
          <input type="text" pInputText  placeholder="请输入授权人姓名" [(ngModel)]="rentalParkSpace.authorizedPersonName"/>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >车主电话</label>
        </div>
        <div class="ui-g-8">
          <input type="text" pInputText placeholder="请输入授权人电话" [(ngModel)]="rentalParkSpace.authorizedPersonPhone"/>
        </div>
      </div>
      <div class="ui-g-6"  style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >车主身份证号</label>
        </div>
        <div class="ui-g-8">
          <input type="text" pInputText placeholder="请输入授权人身份证号" [(ngModel)]="rentalParkSpace.authorizedPersonIdNumber"/>
        </div>
      </div>
      <div class="ui-g-6"  style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >车位地点</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <p-dropdown [options]="parkSpacePlaceOption" placeholder="请选择车牌颜色" scrollHeight="100px" [(ngModel)]="rentalParkSpace.parkingSpacePlace"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6"  style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >车位类型</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <p-dropdown [options]="parkSpaceTypeOption" placeholder="请选择车牌颜色" scrollHeight="100px" [(ngModel)]="rentalParkSpace.parkingSpaceType"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >车牌号</label>
        </div>
        <div class="ui-g-8">
          <input type="text" pInputText placeholder="请输入车牌号" [(ngModel)]="rentalParkSpace.licensePlateNumber"/>
        </div>
      </div>
      <div class="ui-g-6"  style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >车牌颜色</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <p-dropdown [options]="lincesePlateColorOption" placeholder="请选择车牌颜色" scrollHeight="100px" [(ngModel)]="rentalParkSpace.licensePlateColor"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6"  style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >车牌类型</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <p-dropdown [options]="lincesePlateTypeOption"  placeholder="请选择车牌类型" scrollHeight="100px" [(ngModel)]="rentalParkSpace.licensePlateType"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >车辆原始类型</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <p-dropdown [options]="vehicleOriginaTypeOption"  placeholder="请选择车辆原始类型" scrollHeight="100px" [(ngModel)]="rentalParkSpace.vehicleOriginalType"></p-dropdown>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >应收金额</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <input type="text" pInputText placeholder="请输入应收金额" [(ngModel)]="rentalParkSpace.actualMoneyCollection"/>
        </div>
      </div>
      <div class="ui-g-6" style="line-height: 4vh">
        <div class="ui-g-4" style="text-align: right">
          <label >实收金额</label>
        </div>
        <div class="ui-g-8" style="line-height: 2.5vh">
          <input type="text" pInputText placeholder="请输入实收金额" [(ngModel)]="rentalParkSpace.amountReceivable"/>
        </div>
      </div>
    </div>
    <p-footer>
      <div class="ui-dialog-buttonpane ui-helper-clearfix" style="text-align: center">
        <button class="charge-details-dialog-Btn charge-details-dialog-Btn-sure" (click)="rentalparkSpaceClick()">确认</button>
        <button class="charge-details-dialog-Btn charge-details-dialog-Btn-false" (click)="parkSpaceOptionDialog = false;this.rentalHiddenInfo = true;">取消</button>
      </div>
    </p-footer>
  </p-dialog>
  <!--    树结构-->
  <p-dialog [(visible)]="treeDialog" [responsive]="true" showEffect="fade" [modal]= false [maximizable]="false" [baseZIndex]="10000" [modal]="true" [width]="350" [height]="400">
    <div class="ui-g ui-fluid">
      <div class="ui-g-12">
        <p-scrollPanel [style]="{width: '100%', height: '300px'}">
          <p-tree
            [value]="dataTrees"
            [(selection)]="dataTree"
            selectionMode="single">
          </p-tree>
        </p-scrollPanel>
      </div>
    </div>
    <p-footer>
      <div class="ui-dialog-buttonpane ui-helper-clearfix" style="text-align: center">
        <button  class="charge-details-dialog-Btn charge-details-dialog-Btn-sure" style="width: 4vw" (click)="dataTreeSureClick()">确认</button>
        <button  class="charge-details-dialog-Btn charge-details-dialog-Btn-false" style="width: 4vw" (click)="treeDialog = false">取消</button>
      </div>
    </p-footer>
  </p-dialog>
  <rbi-upload-file-record [uploadRecordOption]="uploadRecordOption"></rbi-upload-file-record>
  <rbi-detail-pop [dialogOption]="dialogOption"></rbi-detail-pop>
  <rbi-file-pop [UploadFileOption]="uploadFileOption" (event)="uploadFileSureClick($event)"></rbi-file-pop>
  <rbi-paging [option]="option" (pageClick)="nowpageEventHandle($event)"></rbi-paging>
</div>

